<template>
  <div class="bill">
	<header-bar :text="title" :left="left" :right="right" @rightClick="rightClick"></header-bar>
<div class="billallList">
<router-link :to="'/extract?code='+item.name+'&value='+item.msg.value" v-for="(item,key) in list" :key="key">
  <div class="bill-list" style="height:73px">
  <div class="bill-head">
		<div class="bill-head-r">
            <div class="bill-head-r-p" style="margin-bottom:16px;">
			</div>
			<div class="bill-head-r-p">
				<div style="color:#353535">{{item.name}}</div>
				<div>
					<span style="font-weight: 600;color:#353535;font-weight:500;">可提币额{{item.msg.value}}</span>
				</div>
			</div>
			<div class="bill-head-r-p" style="font-size:13px;">
				<span style="color:#888">锁仓 {{item.msg.lockValue}}</span>
				<span>
					<div class="bill-status" style="color:#888;">总余额{{item.msg.value+item.msg.lockValue+item.msg.freezeValue+item.msg.giveValue}}</div>
				</span>
			</div>
      
		</div>
    <div class="tmentbot">
        <i class="iconfont icon-xiangyou"></i>
      </div>
  </div>
</div>
</router-link>
</div>
  </div>
</template>
<script>
import {
  Header,
  CellSwipe,
  InfiniteScroll,
  Toast,
  Indicator,
  MessageBox
} from "mint-ui";
import { mapState, mapGetters, mapMutations, mapActions} from 'vuex';
import util from '../assets/js/util.js'
import headerBar from "./main/header";
import moment from "moment";
import { transactList } from "../api/api.js";
export default {
  name: "Bill",
  data() {
    return {
      msg: "",
      title: "提币",
      left: {
        status: true
      },
      right: {
        status: true,
        text: "记录"
      },
      list:[],
      pageNum: 1,
      pageSize: 5,
    };
  },
  computed: {
    ...mapState([
      'pageInfo'
    ])
  },
  methods: {
    rightClick(){
      this.$router.push({
              path:"/bill",
          })
    }
  },
  created(){
    this.$store.dispatch('getUserInfo')
    let userInfo =util.getLocalStorage('userinfo')?JSON.parse(util.getLocalStorage('userinfo')):"";
    let arr=userInfo['coinData'];
    for(var key in arr){
      this.list.push({name:key,msg:arr[key]});
    }
    // console.log(this.list);
  },
  mounted() {
    
  },
  components: {
    headerBar
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
@import url("../../static/css/oldincome.css");
.bill-list{
  display: flex;
}
.bill-head{
  flex: 1;
}
.tmentbot{
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color:#888;
}
a{
  text-decoration: none;
  display: block;
  border-bottom: 1px solid #ccc;
}
</style>
